<div class="content">
  <h1 class="title">Coding Assistance</h1>

  <div class="features_list_container debugger_features_list code_assistance">
    <ul class="features_list margined">
      <li><a href="#semantic_code_highlighting">Semantic Code Highlighting</a></li>
      <li><a href="#smart_audio_completion">Smart Auto-Completion</a></li>
      <li><a href="#parameter_info">Parameter Info</a></li>
      <li><a href="#quick_info">Quick Info</a></li>
      <li><a href="#auto_import">Auto Import</a></li>
      <li><a href="#code_snippets">Code Snippets</a></li>
      <li><a href="#auto_closing_braces">Auto-closing Braces</a></li>
      <li><a href="#highlight_matching_braces">Highlight Matching Braces</a></li>
      <li class="bottom"><a href="#asdoc_highlighting">ASDoc Highlighting</a></li>
    </ul>
    <ul class="features_list">
      <li><a href="#underline_color">Underline color</a></li>
      <li><a href="#highlight_current_line">Highlight Current Line</a></li>
      <li><a href="#comment_uncomment_code">Comment/Uncomment Code</a></li>
      <li><a href="#auto_extend_multiline_comment">Auto-extend Multi-line Comments</a></li>
      <li><a href="#outlining">Outlining</a></li>
      <li><a href="#highlight_references_under_cursor">Highlight references under cursor</a></li>
      <li><a href="#triple_click">Triple Click</a></li>
      <li><a href="#fix_mixed_tabs">Fix Mixed Tabs</a></li>
    </ul>
  </div>

  <div class="feature" id="mainFeatureBlock">
    <div class="subsection">
      <a name="semantic_code_highlighting"></a>
      <h2 class="subsection_header">Semantic Code Highlighting</h2>
      <p>
        The highlighting of keywords, ASDoc tags, TODO tokens,
        comments, constants, XML tags and attributes makes your code easy to read and debug.
      </p>
      <img class="lazyloaded" width="623" height="594" src="/images/gray.gif" data-original="/images/features/semantic_code_highlighting.png" alt="Semantic Code Highlighting" title="Semantic Code Highlighting" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="smart_audio_completion"></a>
      <h2 class="subsection_header">Smart Auto-Completion</h2>
      <p>
        Writing code is much faster with intelligent auto-completion.
      </p>
      <p>
        When you type in several characters of the identifier name, the most appropriate identifiers
        for the context are suggested in the auto-completion window.
      </p>
      <p>
        You can either keep typing or simply choose the identifier from the list by pressing
        Tab to complete the code with the suggested name.
      </p>
      <img class="lazyloaded bordered" width="620" height="71" src="/images/gray.gif" data-original="/images/features/smart_auto_completion.png" alt="Completion after new" />
      <h3>After "new" keyword</h3>
      <img class="lazyloaded bordered" width="484" height="111" src="/images/gray.gif" data-original="/images/features/smart_auto_completion_after_new.png" alt="Completion after new" />
      <h3>After "override" keyword</h3>
      <img class="lazyloaded bordered" width="569" height="166" src="/images/gray.gif" data-original="/images/features/smart_auto_completion_after_override.png" alt="Completion after override" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="parameter_info"></a>
      <h2 class="subsection_header">Parameter Info</h2>
      <p>
        Writing parameters is faster with CodeDrive Parameter Info feature which opens
        the Parameters list to give you information about parameters required by a function.
      </p>
      <img class="lazyloaded bordered" width="483" height="86" src="/images/gray.gif" data-original="/images/features/parameter_info.png" alt="Parameter Info" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="quick_info"></a>
      <h2 class="subsection_header">Quick Info</h2>
      <p>
        CodeDrive's Quick Info option shows the complete declaration for any identifier
        in your code under mouse cursor.
      </p>
      <img class="lazyloaded bordered" width="543" height="239" src="/images/gray.gif" data-original="/images/features/quick_info.png" alt="Quick Info" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="auto_import"></a>
      <h2 class="subsection_header">Auto Import</h2>
      <p>
        When you add a class name without an appropriate import statement,
        CodeDrive will automatically add such an import statement to your package.
      </p>
      <img class="lazyloaded bordered" width="379" height="146" src="/images/gray.gif" data-original="/images/features/auto_import.png" alt="Auto Import" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="code_snippets"></a>
      <h2 class="subsection_header">Code Snippets</h2>
      <p>
        CodeDrive helps you to get advantage from frequently used pieces of source code (code snippets).
        Using code snippets allows you to insert the frequently used code constructions with short aliases.
      </p>
      <p>
        CodeDrive has about twenty ready-to-use code snippets built in. Code snippets makes input much faster
        for package, class, interface, method, constructor and key ActionScript constructions
        like  if, do..while, while, try...finally.
      </p>
      <img class="lazyloaded bordered" width="558" height="92" src="/images/gray.gif" data-original="/images/features/code_snippets.png" alt="Code Snippets" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="auto_closing_braces"></a>
      <h2 class="subsection_header">Auto-closing Braces</h2>
      <p>
        CodeDrive helps you write code faster automatically closing braces for expressions and blocks.
        When you type ( or [ CodeDrive will automatically add closing ) or ] on the same line. When you type &#123;
        CodeDrive will add &#125; on a new line in the corresponding position.
      </p>
      <img class="lazyloaded bordered" width="277" height="79" src="/images/gray.gif" data-original="/images/features/auto_closing_parentheses.png" alt="Auto-closing Braces" />
      {include file='include/to_the_top_block.tpl'}
    </div>
    <div class="subsection">
      <a name="highlight_matching_braces"></a>
      <h2 class="subsection_header">Highlight Matching Braces</h2>
      <p>
        CodeDrive helps better understanding your code highlighting pairs of matching (), [] and &#123;&#125; braces.
      </p>
      <img class="lazyloaded bordered" width="389" height="92" src="/images/gray.gif" data-original="/images/features/highlight_matching_parentheses.png" alt="Highlight Matching Braces" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="asdoc_highlighting"></a>
      <h2 class="subsection_header">ASDoc Highlighting</h2>
      <p>
        CodeDrive helps better understanding your code highlighting ASDoc comments.
      </p>
      <img class="lazyloaded bordered" width="511" height="208" src="/images/gray.gif" data-original="/images/features/asdoc_highlighting.png" alt="Highlight Matching Braces" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="underline_color"></a>
      <h2 class="subsection_header">Underline color</h2>
      <p>
        CodeDrive underlines every color with the respective color.
      </p>
      <img class="lazyloaded bordered" width="373" height="76" src="/images/gray.gif" data-original="/images/features/underline_color.png" alt="Underline color" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="highlight_current_line"></a>
      <h2 class="subsection_header">Highlight Current Line</h2>
      <p>
        CodeDrive saves time searching for the cursor when navigating files and changing focus.
      </p>
      <img class="lazyloaded bordered" width="466" height="100" src="/images/gray.gif" data-original="/images/features/highlight_current_line.png" alt="Highlight Current Line" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="comment_uncomment_code"></a>
      <h2 class="subsection_header">Comment/Uncomment Code</h2>
      <p>
        CodeDrive provides quickly comment or uncomment line and selected code. <br />
        You can use <b>Ctrl+E+C</b> to comment, <b>Ctrl+E+U</b> to uncomment.
      </p>
    </div>
 
    <div class="subsection">
      <a name="auto_extend_multiline_comment"></a>
      <h2 class="subsection_header">Auto-extend Multi-line Comments</h2>
      <p>
        CodeDrive inserts the appropriate comment token on the next line automatically <br />
        after pressing Enter inside a multi-line comment.
      </p>
      <img class="lazyloaded bordered" width="416" height="154" src="/images/gray.gif" data-original="/images/features/auto_extend multi_line comments.png" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="outlining"></a>
      <h2 class="subsection_header">Outlining</h2>
      <p>
        CodeDrive allows to collapse/expand some part of your code: functions, classes, comments making your
        code navigation more comfortable.
      </p>
      <img class="lazyloaded bordered" width="549" height="364" src="/images/gray.gif" data-original="/images/features/outlining.png" alt="Outlining" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="highlight_references_under_cursor"></a>
      <h2 class="subsection_header">Highlight references under cursor</h2>
      <p>
        CodeDrive provides highlight references to symbol at the caret position automatically.
      </p>
      <p>
     In a code file in the editor, when you click a symbol, all instances of the symbol are automatically highlighted.
     Highlighted symbols may include declarations and references, and generally anything else that Find All References
     would return. This includes the names of classes, objects, variables, methods, and properties.
      </p>
      <img class="lazyloaded bordered" width="530" height="105" src="/images/gray.gif" data-original="/images/features/find_references_image.png" alt="Find References" />
      {include file='include/to_the_top_block.tpl'}
    </div>
 
    <div class="subsection">
      <a name="triple_click"></a>
      <h2 class="subsection_header">Triple Click</h2>
      <p>
        Triple Click simple feature that migrated from other editors, it selects whole line on triple click.
      </p>
    </div>
 
    <div class="subsection">
      <a name="fix_mixed_tabs"></a>
      <h2 class="subsection_header">Fix Mixed Tabs</h2>
      <p>
        Fix Mixed Tabs detects when you have mixed tabs and spaces and offers to fix them for you automatically.
      </p>
    </div>
 
    <div class="subsection">
      <h2 class="subsection_header">And much more...</h2>
      <p>
        Since CodeDrive is based on Visual Studio, one of the most advanced IDEs,
        all standard Visual Studio features are also available for Flash developers
        in CodeDrive.
      </p>
    </div>
  </div>
</div>